<template>
    <div class="xunjian">
        <section class="headBtn">
            <div :class="{ active: isActive==0 }" @click="getList(0)">
                未完成({{num.unfinish}})
            </div>
            <div :class="{ active: isActive==2 }" @click="getList(2)">
                已完成({{num.finish}})
            </div>
        </section>
        <section class="bodyList">
            <div class="list" v-if="list.length==0" style="text-align:center;display:block">
                暂无数据
            </div>
            <div class="list" v-for="item in list" :key="item.value" @click="goDetails(item.id)">
                <div style="flex:0 0 95%">
                    <b>
                        {{item.taskName}}
                    </b>
                </div>
                <div style="flex:0 0 5%">
                    <i class="iconfont icon-jiantou-copy" style="color:#409eff;"></i>
                </div>
                <div class="flex">
                    <div class="type">巡检数量：{{item.playNum}}</div>
                    <div class="type">巡检人：{{item.taskUser}}</div>
                </div>
                <div class="flex">
                    巡检时间：{{item.taskStarttime}}&nbsp;至&nbsp;{{item.taskEndtime}}
                </div>
            </div>
        </section>
    </div>
</template>

<script>
export default {
    data() {
        return {
            isActive: 0,
            list: [],
            pageSize: 10,
            num: {}
        }
    },
    mounted() {
        this.getList(0)
        this.windowscroll()
        this.getNum()
    },
    methods: {
        //获取列表
        getList(num) {
            this.isActive = num
            this.$api.xunjian.itasklist({
                pageNo: '1',
                pageSize: this.pageSize,
                status: num
            }).then(res => {
                if (res.success) {
                    this.list = res.data.list
                }
            })
        },
        //拖到底端加载
        windowscroll() {
            var that = this
            $(window).on("scroll", function () {    //给window绑定scroll触底事件
                // console.log($(window).scrollTop() + $(window).height() + 1 + ',' + $(document).height())
                if ($(window).scrollTop() + $(window).height() + 1 > $(document).height()) {
                    // $(".nextPage").trigger("click")
                    that.pageSize += 10
                    that.getList(that.isActive)
                }
            })
        },
        goDetails(id) {
            if (this.isActive == 0) {
                this.$router.push({ path: 'details', query: { id: id } })

            }
            if (this.isActive == 2) {
                this.$router.push({ path: 'details2', query: { id: id } })

            }
        },
        //获取数量
        getNum() {
            this.$api.xunjian.navInspect().then(res => {
                if (res.success) {
                    this.num = res.data
                }
            })
        },
    }
}
</script>

<style>
</style>
